<!-- 用途：用于支持字符串和数字类型的输入，同时进行数据转换 -->
<script setup>
import { onMounted, ref } from 'vue';

const props = defineProps({
    data: {
        type: Array
    },
    inputWidth: {
        type: String,
        default: '100%'
    },
    placeholder: {
        type: String,
        default: "请输入内容"
    },
})
let inputData = ref()
const emits = defineEmits(['update:data'])
const inputChanged = ()=>{
    console.log("inputData.value:",inputData.value)
    // 把string转成list，然后回调父组件更新数据
    emits('update:data', inputData.value.split('\n'))
}
onMounted(()=>{
    console.log("props.data:", props.data)
    // 先把数据从list转成string
    if (props.data) {
        inputData.value = props.data.join('\r\n')
    }
    
})
</script>

<template>
  <el-input type="textarea" v-model="inputData" :placeholder="props.placeholder" :style="{width: props.inputWidth}"  @change="inputChanged()"/>
</template>  

<style scoped>

</style>